// 属性选择器 margintop
$direction: (l left, r right, t top, b bottom);
  
@for $i from 1 through 50 {

  @each $type in m,
  p,
  v,
  h,
  a {

    @if $type==m {
      @each $d in $direction {
        .m#{nth($d, 1)}#{$i} {
          margin-#{nth($d, 2)}: #{$i}px;
        }
      }
    }

    @else if $type==p {
      @each $d in $direction {
        .p#{nth($d, 1)}#{$i} {
          padding-#{nth($d, 2)}: #{$i}px;
        }
      }
    }

    @else if $type==h {
      .ph#{$i} {
        padding-left: #{$i}px;
        padding-right: #{$i}px;
      }

      .mh#{$i} {
        margin-left: #{$i}px;
        margin-right: #{$i}px;
      }
    }

    @else if $type==v {
      .pv#{$i} {
        padding-top: #{$i}px;
        padding-bottom: #{$i}px;
      }
    }

    @else {
      .pa#{$i} {
        padding: #{$i}px;
      }
    }
  }
}

//   高度
@for $i from 1 through 200 {
  .height#{$i} {
    height: #{$i}px;
  }
}
@for $i from 1 through 100 {
  .lineH#{$i} {
    line-height: #{$i}px;
  }
}
@for $i from 1 through 400 {
  .width#{$i} {
    width: #{$i}px;
  }
}

.decoration {
  text-decoration: line-through;
}

@for $i from 1 through 20 {
  .radius#{$i} {
    border-radius: #{$i}px;
  }
}

@for $i from 5 through 50 {
  .fontZ#{$i * 2} {
    font-size: #{$i * 2}px;
  }
}
@for $i from 400 through 600 {
  .fwei#{$i} {
    font-weight: #{$i};
  }
}
@for $i from 0 through 20 {
  .transTop#{$i} {
    transform: translateY(#{$i}px);
  }
}
.t-center{
  text-align: center;
}
.width100{
  width: 100%;
}
.height100{
  height: 100%;
}
